<template>
  <view>
    <u-sticky bgColor="#fff">
      <u-tabs
        active-color="#409EFF"
        :bg-color="'#FFFFFF'"
        :current="tab_index"
        :list="tab_list"
        @change="tab_change"
        :scrollable="false"
        lineWidth="60"
        lineHeight="5"
        itemStyle="background-color: #fff; height: 88rpx"
      ></u-tabs>
    </u-sticky>

    <view v-if="isGetData">
      <HeadInfo
        :ReceiveDetail="ReceiveDetail"
        :current="current"
        @getData="getData"
        :tab_index="tab_index"
      />
      <Info v-if="tab_index === 0" :ReceiveDetail="ReceiveDetail" />
      <Account v-else-if="tab_index === 1" :ReceiveDetail="ReceiveDetail" />
      <Log v-else-if="tab_index === 2" :ReceiveDetail="ReceiveDetail" />
    </view>
  </view>
</template>

<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app'
import { reactive, ref } from 'vue'
import Account from '@/receivePages/detail/com/account.vue'
import Info from '@/receivePages/detail/com/info.vue'
import Log from '@/receivePages/detail/com/log.vue'
import HeadInfo from '@/receivePages/detail/com/headInfo.vue'
import {
  INF_ReceiveInfoV1_res,
  ReceiveInfoV1,
  TYPE_BookType
} from '@/api/server/v1/receive'
import { init_ReceiveDetail } from '@/receivePages/detail/initState'

const tab_list = ref([
  { name: '详情', tab: 0 },
  { name: '账务', tab: 1 },
  { name: '日志', tab: 2 }
])
const current = reactive({
  roomNo: '-1',
  roomInfo: {},
  linkType: ''
})
const tab_index = ref<number>(0)
// const ReceiveDetail = ref<INF_ReceiveListV1_info>({
//   Id: '',
//   Room: '',
//   TheClass: '', // 散客
//   CheckIn: null,
//   CheckOut: null,
//   WillLeave: null,
//   Price: 0,
//   Days: 0,
//   AllXf: 0,
//   AllYj: 0,
//   AllYsq: 0,
//   State: '',
//   ServiceMan: '',
//   Cashier: null,
//   ManNum: 0,
//   DR: 0,
//   NormalPrice: 0,
//   DateMan: '',
//   DateManDate: '',
//   CheckOutDateMan: null,
//   CheckOutDateManDate: null,
//   Note: '',
//   TheCompany: '',
//   ReceiveInClass: '',
//   RoomClass: '',
//   RoomClassId: 0,
//   Floor: 0,
//   XsName: '',
//   VipNo: '',
//   VipId: 0,
//   VipLev: '',
//   LinkId: null,
//   BillId: '',
//   GuestName: '',
//   Tel: '',
//   Secret: false,
//   TheCompanyId: 0,
//   BreakFastNum: 0,
//   BookId: null,
//   BookServiceMan: null,
//   BookMan: null,
//   Notice: '',
//   MoveToId: null,
//   ReceiveMan: [],
//   ReceivePortions: null,
//   SexList: '',
//   Zk: 0,
//   HasPricePlan: false,
//   TimeoutPrice: null,
//   InvoiceTotal: 0,
//   Lunch: 0,
//   Dinner: 0,
//   xmin: 0,
//   BookType: 'Ordinary',
//   rentalItems: null
// })

const ReceiveDetail = ref<INF_ReceiveInfoV1_res>(init_ReceiveDetail)

const isGetData = ref(false)

const tab_change = function (e: any) {
  tab_index.value = e.tab
}
const change_current_roomNo = function (
  RoomNo: string,
  BookType: TYPE_BookType
) {
  if (current.roomNo !== RoomNo) {
    current.roomNo = RoomNo
    current.roomInfo = ReceiveDetail.value.Links.filter(
      (item) => item.RoomNo === RoomNo
    )[0]
    switch (BookType) {
      case 'Ordinary':
        current.linkType = ''
        break
      case 'Link':
        current.linkType = '联房'
        break
      case 'Team':
        current.linkType = '团队'
        break
    }
  }
}

const getData = function (id: string) {
  ReceiveInfoV1({ id }).then((res) => {
    const result = res as INF_ReceiveInfoV1_res
    ReceiveDetail.value = result
    change_current_roomNo(result.Room, result.BookType)

    // 团队主单或者联房主单排最前
    const Links = ReceiveDetail.value.Links
    for (let i = 0; i < Links.length; i++) {
      let current_item = Links[i] // {}
      if (current_item.Master && i !== 0) {
        const first_item = Links[0]
        Links[0] = current_item
        Links[i] = first_item
      }
    }
    isGetData.value = true
    console.log(ReceiveDetail.value)
  })
}

onLoad((routeParams) => {
  const id: string = (routeParams as { id: string }).id
  getData(id)
})
</script>

<style lang="scss" scoped>
:deep(.u-tabs__wrapper__nav__line) {
  margin-left: 30rpx;
}
</style>
